<!--云闪推——采集任务-->
<template>
  <div class="ele-body">
    <task-search @search="reload"></task-search>
    <el-card class="m-top10 p-algin10" shadow="never">
      <ele-pro-table
        ref="table"
        size="mini"
        :columns="columns"
        :datasource="datasource"
        :selection.sync="selection"
        :need-page="true"
        :hideOnSinglePage="false"
      >
        <!--头部按钮-->
        <template v-slot:toolbar>
          <el-button type="primary" size="small" @click="addSpaceClick">
            添加任务
          </el-button>
        </template>
        <!--任务进度插槽-->
        <template v-slot:progress="{ row }">
          <el-progress :percentage="row.taskProgressCount || 0"></el-progress>
        </template>
        <!--操作-->
        <template v-slot:action="{ row }">
          <div class="flex-around">
            <el-link
              type="primary"
              :underline="false"
            >
              查看素材
            </el-link>
            <!-- :disabled="true"-->
            <el-link
              type="danger"
              :underline="false"
            >
              终止任务
            </el-link>
            <el-link
              type="danger"
              :underline="false"
              @click.stop="delSingle(row)"
            >
              删除
            </el-link>
          </div>
        </template>
      </ele-pro-table>

      <!--成片配置 弹窗-->
      <btn-configuration
        :data="data"
        :mcList="mcList"
        :musics="musics"
        ref="pieceSet"
        @click="piecesSet"
        :visible.sync="drawer"
        @done="onDone"></btn-configuration>
    </el-card>
  </div>

</template>

<script>
  import {delTask, queryTaskPage} from "@/api/digitalHumanManagement/taskList";
  import TaskSearch from "@/views/lncomingManagement/cameraManage/piecemealTask/components/task-search";
  import moveFile from "@/views/lncomingManagement/cameraManage/automaticSlicing/components/move-file";
  import BtnConfiguration from "@/views/lncomingManagement/cameraManage/collectMaterials/components/btn-configuration";

  export default {
    name: "index",
    components: {BtnConfiguration, TaskSearch},
    data(){
      return{
        // 当前编辑数据
        current: null,
        // 表格列配置
        columns: [
          /* {
             columnKey: 'selection',
             type: 'selection',
             width: 45,
             align: 'center'
           },*/
          {
            prop: 'sortNumber',
            label: '排序',
            align: 'center',
            showOverflowTooltip: true,
            width: 60
          },

          {
            prop: 'taskName',
            label: '任务名称',
            align: 'center',
            width:200,
            showOverflowTooltip: true
          },
          {
            prop: 'imgName',
            label: '文件夹名',
            width:200,
            align: 'center',
            showOverflowTooltip: true
          },
          {
            prop: 'numberOfWorks',
            label: '设备状态',
            width:200,
            align: 'center',
            showOverflowTooltip: true
          },
          {
            slot: 'progress',
            prop: 'progress',
            label: '任务进度 ',
            align: 'center',
            width:300,
            showOverflowTooltip: true,
          },
          {
            prop: 'likeCount',
            label: '创建时间 ',
            align: 'center',
            showOverflowTooltip: true,
          },
          {
            prop: 'commentCount',
            label: '结束时间 ',
            align: 'center',
            showOverflowTooltip: true
          },

          {
            label: '操作',
            columnKey: 'action',
            width: 260,
            align: 'center',
            resizable: false,
            slot: 'action',
            hideInSetting: true,
            showOverflowTooltip: true,
            fixed: 'right'
          }
        ],
        // 表格选中数据
        selection: [],
      }
    },
    methods:{
      /* 如果想在数据源里面获取到接口返回的数据, 增加 async 和 await */
      async datasource({ page, limit, where, order }) {
        const result = await queryTaskPage({ ...where, ...order, page, limit,...this.activityList,
          merchantId: this.$store.state.user.info.merchantId  // 商家id
        });
        return result;  // 这里返回的数据要包含 list 和 count 两个字段，字段名称可以通过 response 属性配置
      },
      /* 刷新表格 */
      reload(where) {
        this.$refs.table.reload({ page: 1, where: where });
      },
      /* 删除 */
      delSingle(row) {
        let ids=[]
        ids.push(row.id)
        console.log("ids====",ids)
        this.delGroups(ids)
      },
      delGroups(ids){
        this.$confirm('此操作将永久删除该任务, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          delTask({
            ids:ids
          })
            .then((data) => {
              this.reload()
              this.$message.success('删除成功!');
            })
            .catch((e) => {
              this.$message.error(e);
            });
        }).catch(() => {
          this.$message.info('已取消删除');
        });
      }
    }
  }
</script>

<style scoped>

</style>

